<?xml version="1.0" encoding="UTF-8"?>
<ui:component xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich">

	<ui:composition template="/pages/templates/layout_principal.xhtml">
		<ui:define name="body" width="100%">
			<h:form>
				<h:panelGrid styleClass="titulo">
					<h:outputText styleClass="titulo" value="#{menuControl.nomeProjetoSelecionado} - Atividades" />
				</h:panelGrid>
				
				<br/>
				<rich:panel header="Detalhes da Iteração" rendered="#{registrarExecucaoControl.mostrarDetalhesIteracao}">
					<h:panelGrid columns="2">
						<h:panelGroup>
							Iteração: 
						</h:panelGroup>
						<h:panelGroup>
							#{registrarExecucaoControl.iteracao.fase.faseRup.nome} # #{registrarExecucaoControl.iteracao.numero}
						</h:panelGroup>
						<h:panelGroup>
							Início Estimado: 
						</h:panelGroup>
						<h:panelGroup>
							<h:outputText value="#{registrarExecucaoControl.iteracao.inicio}">
								<f:convertDateTime pattern="dd/MM/yyyy" />
							</h:outputText>
						</h:panelGroup>
						<h:panelGroup>
							Fim Estimado: 
						</h:panelGroup>
						<h:panelGroup>
							<h:outputText value="#{registrarExecucaoControl.iteracao.fim}">
								<f:convertDateTime pattern="dd/MM/yyyy" />
							</h:outputText>
						</h:panelGroup>
					</h:panelGrid>
				</rich:panel>
				<br />
				<rich:panel header="Minhas Atividades">
					<rich:dataTable id="listaAtividades"  
						var="atividade"
						value="#{registrarExecucaoControl.atividades}"
						rowClasses="odd-row, even-row" 
						styleClass="stable">
						
						<f:facet name="header">
							<rich:columnGroup>
								<rich:column>#</rich:column>
								<rich:column>Nome</rich:column>
								<rich:column>Início</rich:column>
								<rich:column>Fim</rich:column>
								<rich:column>Horas<br/> estimadas</rich:column>
								<rich:column>Horas<br/> realizadas</rich:column>
								<rich:column>Status</rich:column>
								<rich:column colspan="2">Execuções</rich:column>
							</rich:columnGroup>
						</f:facet>
						
						<rich:column style="width: 5%;">
							#{atividade.numero}
						</rich:column>
						<rich:column>
							#{atividade.nome}
						</rich:column>
						<rich:column style="width: 10%; text-align: center;">
							<h:outputText value="#{atividade.inicioEstimado}">
								<f:convertDateTime pattern="dd/MM/yyyy" />
							</h:outputText>
						</rich:column>
						<rich:column style="width: 10%; text-align: center;">
							<h:outputText value="#{atividade.fimEstimado}">
								<f:convertDateTime pattern="dd/MM/yyyy" />
							</h:outputText>
						</rich:column>
						<rich:column style="width: 10%; text-align: center;">
							#{atividade.horasEstimadas}
						</rich:column>
						<rich:column style="width: 10%; text-align: center;">
							#{atividade.horasRealizadas}
						</rich:column>
						<rich:column>
							#{atividade.status.descricao}
						</rich:column>
						
						<rich:column style="width: 3%; text-align: center;">
							<h:commandLink action="#{registrarExecucaoControl.obterAtividade}">
								<f:setPropertyActionListener target="#{registrarExecucaoControl.idAtividadeSelecionada}" value="#{atividade.id}"/>
								<h:graphicImage library="images" name="pencil.png" title="Visualizar Execuções" />
							</h:commandLink>
						</rich:column>
					</rich:dataTable>
				</rich:panel>
			</h:form>
			
			<rich:jQuery  selector=".stable tr" event="mouseover" query="jQuery(this).addClass('active-row')" />
			<rich:jQuery selector=".stable tr" event="mouseout" query="jQuery(this).removeClass('active-row')" />
		</ui:define>
		<rich:jQuery selector=".stable tr:odd" query="addClass('odd-row')" />
		<rich:jQuery selector=".stable tr:even" query="addClass('even-row')" />

	</ui:composition>

</ui:component>